﻿@using PerpetuumSoft.Knockout
@using TimeProject.WebSite.Views;

@model TimeProject.WebSite.ViewModels.MyAccountViewModel
@{
    var ko = Html.CreateKnockoutContext();
}

@using (ko.With(m => m.Messages))
{
    @Html.GetInfoBox(Model.Messages)
}

<div class="page-header">
    <h1>MY ACCOUNT <small>View and manage my account.</small></h1>
</div>

<form class="form-horizontal">    
    <div class="well">        
        <div class="row-fluid">
            <div class="span12">
                <div class="control-group">
                    <div class="control-label">
                        @Html.GetLabel(x => x.PublicId)
                    </div>
                    <div class="controls">
                        @ko.Html.GetReadonlyTextBox(x => x.PublicId)
                        @Html.GetLinkRight("Delete account", "DeleteAccount")
                        @Html.GetLinkRight("Change password", "ChangePassword")
                    </div>
                </div>
            </div>
        </div>

        <div class="row-fluid">
            <div class="span6">                
                <div class="control-group">
                    <div class="control-label">
                        @Html.GetLabel(x => x.Username)
                    </div>
                    <div class="controls">
                        @ko.Html.GetReadonlyTextBox(x => x.Username)
                    </div>
                </div>
            </div>
        </div>

        <div class="row-fluid">
            <div class="span6">
                <div class="control-group">
                    <div class="control-label">
                        @Html.GetLabel(x => x.FullName)
                    </div>
                    <div class="controls">
                        @ko.Html.GetTextBoxLong(x => x.FullName)
                    </div>
                </div>
            </div>
        </div>
        
        <div class="row-fluid">
            <div class="span6">
                <div class="control-group">
                    <div class="control-label">
                        @Html.GetLabel(x => x.EMail)
                    </div>
                    <div class="controls">
                        @ko.Html.GetTextBoxLong(x => x.EMail)
                    </div>
                </div>
            </div>           
        </div>

        <p class="paragraph-break" />
        
        <table class="table table-striped table-hover table-condensed">
            <caption>Account Preferences</caption>
            <thead>
                @{ var header = Model.UserOptions.FirstOrDefault(); }
                <tr>
                    <th>@Html.DisplayNameFor(model => header.BooleanValue)</th>
                    <th>@Html.DisplayNameFor(model => header.Title)</th>
                </tr>
            </thead>

            <tbody>
                @using (var lines = ko.Foreach(m => m.UserOptions))
                {
                    <tr>
                        <td>@lines.Html.GetCheckBox(m => m.BooleanValue)</td>
                        <td>@lines.Html.Span(m => m.Title)</td>
                    </tr>
                }
            </tbody>
        </table>               
    </div>
    
    @Html.GetFixedBackLink("Index")
    @ko.Html.GetButtonRight("Save", "MyAccount", "fa fa-floppy-o")
    @ko.Init(Model)
</form>

